<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JQ事件之事件监听</title>
</head>
<body>
    <button>跳转</button>

    <script src="./js/jquery.3.5.1.js"></script>
    <script>
        $(function(){
            // 1.绑定
            /* $('button').click(function(){
                console.log('打印');
            }) */

            // 比起基本绑定，更倾向于事件监听绑定

            /* $('button').on('click',function(){
                console.log("打印");
            })
            $('button').on('click',function(){
                console.log("绑定的第二个打印");
            }) */

            // 2.移除案例：流氓跳转网站
            /* 第一次跳转流氓，跳转后关闭开关，才能跳转正常网站 */
            var flag = false;
            $('button').on('click.sn',function(){
                console.log("流氓");
                flag = true;
            })

            $('button').on('click',function(){
                if(!flag){
                    console.log("正常");
                }else{
                    flag = false;
                    $('button').off('click.sn')
                }
            })


        })
    </script>
</body>
</html>